<template>
    <div>
        <button v-for="(item, index) in page_num" :key="item.id" @click="btn(index)">{{ index + 1 }}</button>
        <ul>
            <li v-for="(item, index) in arr" :key="index">{{ item.goods_name }}</li>
        </ul>
    </div>
</template>
<script>
import axios from 'axios';

export default {
    data() {
        return {
            page_num: 0,
            arr: []
        }
    },
    created() {
    },
    mounted() {
        axios.get("https://liu.zzgoodqc.cn/goodsx/goodslist")
            .then(res => {
                this.page_num = Math.ceil(res.data.data.length / 2)
            })
            .catch(e => {
                console.log(e);
            })


        axios.get(`https://liu.zzgoodqc.cn/goodsx/listByPage?+page=1&limit=2`)
            .then(res => {
                this.arr = res.data.data
            })
            .catch(e => {
                console.log(e);
            })
    },
    computed: {
    },
    methods: {
        btn(index) {
            axios.get(`https://liu.zzgoodqc.cn/goodsx/listByPage?+page=${index + 1}&limit=2`)
                .then(res => {
                    this.arr = res.data.data
                })
                .catch(e => {
                    console.log(e);
                })
        },
    },
}
</script>
<style lang="less" scoped></style>
